<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="/account/css/pintuer.css">
    <link rel="stylesheet" href="/account/css/admin.css">

    <script type="text/javascript" src="/account/js/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="/account/js/bootstrap.js"></script>
    <script type="text/javascript" src="/account/js/jquery.serializejson.js"></script>
    <script type="text/javascript" src="/account/js/vue.js"></script>
    <script type="text/javascript" src="/account/js/accountcomponents.js"></script>

</head>
<body>
<div class="panel admin-panel" id="app">
    <div class="panel-head">
        <strong class="icon-reorder"> 账单列表</strong>
    </div>
    <div class="padding border-bottom">
        <form id="Formid">
            <button type="button" class="button border-green" id="checkall" @click="checkall">
                <span class="icon-check"></span> 全选
            </button>
            <button type="button" class="button border-blue">
                <span class="icon-check"></span> <a href="/account/addaccount.html">新增入账表</a>
            </button>
            <input type="hidden" name="opr" value="delall"/>
            <button type="button" class="button border-red" id="goodsupdate" @click="deleteAll">
                <span class="icon-trash-o"></span> 批量删除
            </button>
        </form>
    </div>

    <div class="padding border-bottom">
        <form id="queryForm">
            <ul class="search" style="padding-left: 0px;">
                <li>账单金额大于等于：<input type="text" v-model="example.accountTotal" placeholder="请输入账单金额"
                                    class="input"
                                    style="width: 150px; line-height: 17px; display: inline-block"/>
                </li>
                <li><input type="text" class="input" id="accountSerialNum" v-model="example.accountSerialNum"
                           placeholder="请输入流水单号"
                           style="width: 200px; line-height: 17px;">

                </li>
                <li><select class="input" id="accountRemark" v-model="example.accountRemark"
                            style="width: 200px; line-height: 17px;">
                    <option :value=0>全部</option>
                    <option :value=1>已付款项</option>
                    <option :value=2>待付款项</option>

                </select></li>

            </ul>
        </form>
    </div>
    <page :url="url" :example="example" :columns="columns"></page>
</div>
</body>
<script type="text/javascript">
    var _this = this;
    var b = false;
    var nums = [];
    var app = new Vue({

        el: "#app",
        data: {
            example: {
                accountTotal: 0,
                accountSerialNum: '',
                accountRemark: 0,
                pageIndex: 1,
                num: 5
            },
            url: "/account/account/query",
            columns: [

                {text: "序号", id: "accountId"},
                {text: "流水单号", property: "accountSerialNum"},
                {text: "总金额", property: "accountTotal"},
                {text: "项目id", property: "accountProjectId"},
                {text: "工序号", property: "accountOperationNum"},
                {text: "支付状态", property: "accountRemark"},

            ]//定义分页组件内部表格中的列信息
        },
        // created:function(){
        // 	_this=this;
        // 	$.ajax({
        // 		url:"/account/query",
        // 		type:"post",
        // 		dataType:"json",
        // 		success:function(data){
        // 			_this.accounts=data.list
        // 		}
        // 	})
        //},
        methods: {
            checkall: function () {
                $(":checkbox[name=checkbox]").prop("checked", b = !b);
            },
            deleteAll: function () {
                if (confirm("确认删除吗？")) {
                    $(".checkbox").each(function (id) {
                        if ($(this).prop("checked")) {
                            nums[nums.length] = $(this).parent().next().text();
                        }
                    });

                    $.ajax({
                        url: "/account/account/deleteAll",
                        type: "post",
                        data: {nums: nums},
                        ContentType: "application/json;charset=UTF-8",
                        success: function (data) {
                            $(":checkbox[name=checkbox]").prop("checked", false);
                            _that.selectByExample();
                        }

                    })
                }
            }
        }
    })

</script>
</html>